<?php

use yii\helpers\Html;
use yii\bootstrap\ActiveForm;
use yii\bootstrap\ButtonDropdown;
use yii\bootstrap\Modal;

/* @var $this yii\web\View */
/* @var $searchModel app\models\CustomerSearch */
/* @var $dataProvider yii\data\ActiveDataProvider */

$this->title = Yii::t('app', 'Customer list');
$this->params['breadcrumbs'][] = $this->title;
?>

<style>
	.col-md-10 {
	    padding-left: 0px !important;
	}
	
	.c-table td{
		padding:5px;
	} 
	
	#advanced_search{
		border: 1px solid #e1e1e8;	
		width:420px;
	}

    .modal-dialog {
        margin: 30px auto;
        width: 1030px;
    }

    .c-page{
        cursor : pointer;
    }
</style>

<script>
var grid = null;
var type_search = "basic";

$(document).ready(function() {
	grid = $("#grid").kendoGrid({
        dataSource: {
            transport: {
					read: {
                        url: app.homeUrl + "user/list",
                        dataType: "json",
                        type: "post",
                        data : {}
                    },
            },
            pageSize: app.pageSize,
            requestStart:function(e){
            	var data = {};
            	e.sender.transport.options.read.data = data;
            },
            requestEnd:function(e){
                try{
                    $("#page_info").html(getStringPageInfo(1, e.response.length));
                }catch(ex)
                {
                }
            },

        },
        height: 600,
        filterable: false,
        sortable: false,
        pageable: false,
        columns: [
            {
                title : "<?= Yii::t('app', 'UserName') ?>",
                field : "UserName",
                width : 125,
            },
            {
                field: "UserID",
                title: "<?= Yii::t('app', 'ID') ?>",
                width : 125,
            },
            {
                field: "Pass",
                title: "<?= Yii::t('app', 'Password') ?>",
                width : 125,
            },
            {
                field: "MailAddress ",
                title: "<?= Yii::t('app', 'E-mail') ?>",
                width : 250,
            },
            {
                field: "TellNumber",
                title: "<?= Yii::t('app', 'TellNumber') ?>",
                width : 150,
            },
            {
                field: "ManagementFlag",
                title: "<?= Yii::t('app', 'ManagementFlag') ?>",
                width : 50,
                template: "<div style='text-align: center;font-size:30px;'>#= (ManagementFlag == 1) ? '○' : '×' #</div>"
            },
            {
                field: "ClientDeleteFlag",
                title: "<?= Yii::t('app', 'ClientDeleteFlag') ?>",
                width : 50,
                template: "<div style='text-align: center;font-size:30px;'>#= (ClientDeleteFlag == 1) ? '○' : '×' #</div>"
            },
            {
                field: "ReportFlag",
                title: "<?= Yii::t('app', 'ReportFlag') ?>",
                width : 50,
                template: "<div style='text-align: center;font-size:30px;'>#= (ReportFlag == 1) ? '○' : '×' #</div>"
            },
            {
                field: "ScheduleFlag",
                title: "<?= Yii::t('app', 'ScheduleFlag') ?>",
                width : 50,
                template: "<div style='text-align: center;font-size:30px;'>#= (ScheduleFlag == 1) ? '○' : '×' #</div>"
            },
            {
                field: "",
                title: "",
            },
        ] 
    });

    $('#modalButton').click(function (){

        $('#modal').modal('show')
            .find('#modalContent')
            .load("create");

        //app.homeUrl + "user/

        return false;
    });

    var header = "<th class='k-header'><?= Yii::t('app', 'UserName') ?></th>" +
        "<th class='k-header'><?= Yii::t('app', 'ID') ?></th>" +
        "<th class='k-header'><?= Yii::t('app', 'Pass') ?></th>" +
        "<th class='k-header'><?= Yii::t('app', 'E-mail') ?></th>" +
        "<th class='k-header'><?= Yii::t('app', 'TellNumber') ?></th>" +
        "<th colspan='2' class='k-header'><?= Yii::t('app', 'ManagementFlag') ?></th>" +
        "<th colspan='2' class='k-header'><?= Yii::t('app', 'ReportFlag') ?></th>" +
        "<th class='k-header'></th>"

    $("table > thead", "#grid").html(header);

    //$("table > thead", "#grid")[0].innerHTML(header);
});

function getStringPageInfo(page, total){
    var start = (page - 1) * app.pageSize + 1;
    var end = page * app.pageSize;
    if(end > total) end = total;

    return (start + "-" + end + " / " + total);
}

function toFirstPage(){
    $("#grid").data("kendoGrid").dataSource.query({
        page: 1,
        pageSize: app.pageSize
    });
}

function previewPage(){
    var page = $("#grid").data("kendoGrid").dataSource._page;
    var total = $("#grid").data("kendoGrid").dataSource._total;

    if(page > 1)
        page--;

    $("#grid").data("kendoGrid").dataSource.query({
        page: page,
        pageSize: app.pageSize
    });

    $("#page_info").html(getStringPageInfo(page, total));
}

function nextPage(){
    var lastPage = parseInt($("#grid").data("kendoGrid").dataSource._total / app.pageSize) + 1;
    var page = $("#grid").data("kendoGrid").dataSource._page;
    var total = $("#grid").data("kendoGrid").dataSource._total;

    if(page < lastPage)
        page++;

    $("#grid").data("kendoGrid").dataSource.query({
        page: page,
        pageSize: app.pageSize
    });

    $("#page_info").html(getStringPageInfo(page, total));
}

function toLastPage(){
    var page = parseInt($("#grid").data("kendoGrid").dataSource._total / app.pageSize) + 1;
    var total = $("#grid").data("kendoGrid").dataSource._total;

    $("#grid").data("kendoGrid").dataSource.query({
        page: page,
        pageSize: app.pageSize
    });

    $("#page_info").html(getStringPageInfo(page, total));
}

</script>
<?php 
	$monthList = [];
	
	for($i=1; $i<=12; $i++){
		$monthList[$i] = $i . "月";
	}
?>
<div class="customer-index">

    <div>
        <div style="width:100px; float:left;">
            <label style="height:30px; line-height: 30px; background-color: #0095d8; width:10px;">&nbsp;</label>&nbsp;
            <label style="font-size: 1.1em;"><?= Yii::t('app', 'User list') ?></label>
        </div>

        <div style="float:left; margin-left:30px;">
            <div class="input-group">
                <label href="#" class="btn btn-success" id="modalButton"><?= Yii::t('app', 'Add') ?></label>
            </div><!-- /input-group -->
        </div><!-- /.col-lg-6 -->

        <div style="float:right; margin-right:10px;">
            <div class="input-group" style="font-size: 20px;">
                <label class="c-page" onclick="toFirstPage();"> << </label>
                <label class="c-page" onclick="previewPage();">&nbsp; < </label>
                <label id="page_info" style="font-size: 15px;"></label>
                <label class="c-page" onclick="nextPage();"> > </label>
                <label class="c-page" onclick="toLastPage();">&nbsp; >> </label>
            </div><!-- /input-group -->
        </div><!-- /.col-lg-6 -->
    </div>

    <div style="clear:both;"></div>
	<div id="grid" style="margin-top:10px;">
	</div>

    <?php
    Modal::begin([
        'id' => 'modal',
        'header' => null,
        'options' => [
            'data-keyboard'  => 'false',
            'data-backdrop' => 'static'
        ]
    ]);

    echo "<div id='modalContent'></div>";

    Modal::end();
    ?>
</div>
